<template>
  <el-container>
    <el-main class="wisplm-component-preview">
      <el-row gutter="20">
        <el-col>
          <tab :tabDataList="tabData.tabDataList" :activeName="tabData.activeName">
<!--            <card-list :cardDataList="cardData['cardDataList']" slot="content"/>-->
          </tab>
        </el-col>
        <el-col>
          <card-list :cardDataList="cardData['cardDataList']"/>
        </el-col>
        <el-col :span="6">
          <time-line-list :timeEventList="timeLineData['timeEventList']"/>
        </el-col>
        <el-col :span="6">
          <to-do-list :toDoDataList="toDoData.toDoDataList"/>
        </el-col>
        <el-col :span="7">
          <user-list :user-list="userList"/>
        </el-col>
        <el-col :span="5">
          <patient/>
        </el-col>
        <el-col :span="5">
          <processor/>
        </el-col>
      </el-row>
    </el-main>
  </el-container>
</template>

<script>
import cardList from '@/components/custom/cardList/index'
import patient from '@/components/custom/patient/index'
import processor from '@/components/custom/processor/index'
import tab from '@/components/custom/tab/index'
import timeLineList from '@/components/custom/timeLineList/index'
import toDoList from '@/components/custom/toDoList/index'
import userList from '@/components/custom/userList/index'

export default {
    name: "componentView",
    components: {cardList, patient, processor, tab, timeLineList, toDoList, userList},
    data() {
      return {
          cardData: {
              cardDataList: [
                  {
                      title: '网站空间',
                      img: 'http://www.wisplm.com/static/upload/image/20180412/1523499979727269.jpg',
                      content: '\t                \t    JreCms是开源免费的JAVA企业网站开发建设管理系统，是一套高效、简洁、 强悍的可免费商',
                      id: '1'
                  },
                  {
                      title: '网站建设商城版',
                      img: 'http://www.wisplm.com/static/upload/image/20180412/1523499864406172.jpg',
                      content: '\t                \t    JreCms是开源免费的JAVA企业网站开发建设管理系统，是一套高效、简洁、 强悍的可免费商',
                      id: '2'
                  },
                  {
                      title: '网站建设全能版',
                      img: 'http://www.wisplm.com/static/upload/image/20180412/1523501297516241.jpg',
                      content: '\t                \t    JreCms是开源免费的JAVA企业网站开发建设管理系统，是一套高效、简洁、 强悍的可免费商',
                      id: '3'
                  },
                  {
                      title: '网站建设极速版',
                      img: 'http://www.wisplm.com/static/upload/image/20180412/1523499813391526.jpg',
                      content: '\t                \t    JreCms是开源免费的JAVA企业网站开发建设管理系统，是一套高效、简洁、 强悍的可免费商',
                      id: '4'
                  },
              ],
          },
          tabData: {
              tabDataList: [
                  {
                      title: 'Posts',
                      content: 'Posts',
                      id: 'Posts'
                  },
                  {
                      title: 'About Me',
                      content: 'About Me',
                      id: 'About Me'
                  },
                  {
                      title: 'Setting',
                      content: 'Setting',
                      id: 'Setting'
                  },
              ],
              activeName: 'Posts',
          },
          timeLineData: {
              timeEventList: [
                  {
                      time: '10 minutes ago',
                      eventContent: 'Youtube,a video-sharing website,goes live $500',
                      priority: 'green',
                  },
                  {
                      time: '20 minutes ago',
                      eventContent: 'New order placed #XF-2356.',
                      priority: 'blue'
                  },
                  {
                      time: '30 minutes ago',
                      eventContent: 'john just buy your product Sell $250',
                      priority: 'red'
                  },
                  {
                      time: '15 minutes ago',
                      eventContent: 'StumbleUpon is acquired by eBay. ',
                      priority: 'green'
                  },
              ],
          },
          toDoData: {
              toDoDataList: [
                  {
                      time: '29 July 2020 - 02:26 PM',
                      remark: 'Get Up',
                      priority: '#36C95F',
                  },
                  {
                      time: '29 July 2020 - 02:26 PM',
                      remark: 'Stand Up',
                      priority: '#369DC9',
                  },
                  {
                      time: '29 July 2020 - 02:26 PM',
                      remark: 'Don\'t give up the fight',
                      priority: '#2bc155',
                  },
                  {
                      time: '29 July 2020 - 02:26 PM',
                      remark: 'Do something else',
                      priority: '#ffb800',
                  },
                  {
                      time: '29 July 2020 - 02:26 PM',
                      remark: 'Do something else',
                      priority: '#ffb800',
                  },
              ],
          },
          userList: [
              {
                  avatar: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                  username: 'Aziz Bakree',
                  state: '<span style="color: orange">Pending</span>'
              },
              {
                  avatar: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                  username: 'Griezerman',
                  state: '<span style="color: blue">On Recovery</span>'
              },
              {
                  avatar: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                  username: 'Oconner',
                  state: '<span style="color: red">Rejected</span>'
              },
              {
                  avatar: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
                  username: 'Uli Trumb',
                  state: '<span style="color: green">Recovered</span>'
              }
          ],
      }
  }
}
</script>

<style scoped>
.wisplm-component-preview {
    height: 100%;
}
</style>